<html lang="en" >
<html>
<head>
    <meta charset="UTF-8">
    <title>快捷翻译</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../../../static/struct/layuimini/lib/layui-v2.5.5/css/layui.css" media="all">
    <!--<script type="text/javascript" src="../../static/js/login/jquery.min.js"></script>-->
    <script src="../../../static/struct/layuimini/lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
    <script src="../../../static/struct/layui/layui.js" charset="utf-8"></script>
    <script src="../../../static/js/generaljs/watermarkbycanvas.js" charset="UTF-8"></script>
    <link rel="stylesheet" href="../../../static/css/generalcss/layuitablecheckboxfix.css">
    <script>

        layui.use(['form', 'layedit', 'laydate'], function() {
            var form = layui.form
                , layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate;
        });
        function changeBtnable() {
            if ($('#sourceText').val()) {
                $('#translateBtn').removeClass('layui-btn-disabled');
                $("#translateBtn").removeAttr("disabled");
            } else {
                $('#translateBtn').addClass('layui-btn-disabled');
                $("#translateBtn").attr("disabled","disabled");
            }
        }
        function translateLang() {
            /**
             * 开始get数据结果
             */
            let data = [];
            data.push($('#sourceText').val());
            data.push($('#tolang').val());
            $.ajax({
                url: "/action/translate",
                type: 'post',
                data: JSON.stringify(data),
                contentType:"application/json",
                success: function(result) {
                    if (result.code == 200){
                        /*console.log(obj);
                        console.log(data[0]);*/
                        $('#destinationText').val(result.data);
                    }else {
                        layer.msg('翻译失败');
                    }
                }
            })
        }

    </script>
</head>
<body onload="addWaterMarker()" style="margin: 10px 10px 10px 10px">
<!--
<p>Hello, <shiro:principal/>, how are you today?</p>
<p><shiro:user>guest</shiro:user></p>
<span th:text="${session.usercode}">人员工号</span>
-->

<form class="layui-form" action="">

    <div class="layui-form-item">
        <textarea class="layui-textarea" name="content" placeholder="请输入待翻译文本"  lay-verify="content" id="sourceText" oninput="changeBtnable()" ></textarea>
    </div>

    <div class="layui-form-item" align="center">

            <select name="to" lay-verify="required" lay-search="" id="tolang">
                <option value="en" selected>英文</option>
                <option value="zh">中文</option>
                <option value="jp">日语</option>
                <option value="kor">韩语</option>
                <option value="fra">法语</option>
                <option value="spa">西班牙语</option>
                <option value="it">意大利语</option>
                <option value="ara">阿拉伯语</option>
                <option value="ru">俄语</option>
                <option value="pt">葡萄牙语</option>
            </select>

    </div>

    <div class="layui-form-item">
        <textarea class="layui-textarea" name="content" placeholder="转换区" lay-verify="content" id="destinationText"></textarea>
    </div>

    <div style="width: 100%; ">
        <button type="button" id="translateBtn" disabled="disabled" class="layui-btn layui-btn-fluid layui-btn-disabled" onclick="translateLang()">转换</button>
    </div>
</form>

</body>
<!--
<script type="text/javascript">
    watermark({"watermark_txt": initpro()});
</script>
-->



</html>